<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.5.1.js"></script>
    <script>
        $(function () {
            $("tr").mouseenter(function () {
                var table = $(this).parent();
                var td_len = $('td', $(this)).length;
                var max_td_len = $('td', $('tr', table).get(0)).length;
                var tr_list = $('tr', table);
                var tr_index = tr_list.index($(this));
                if (td_len < max_td_len) {
                    var cur_td_len = td_len;
                    for (var index = tr_index - 1; index >= 0; index--) {
                        var row_td = $('td', tr_list.get(index));
                        var row_td_len = row_td.length;
                        if (row_td_len > cur_td_len) {
                            for (var col = 0; col < row_td_len - cur_td_len; col++) {
                                $(row_td.get(col)).addClass("hover");
                            }
                            cur_td_len = row_td_len;
                        }
                        if (row_td_len === max_td_len) {
                            break;
                        }
                    }
                }
            }).mouseout(function () {
                var table = $(this).parent();
                $('td.hover', table).removeClass("hover");
            });

        });
    </script>
    <style>
        table {
            width: 500px;
        }

        table, td, th {
            border: 1px solid black;
            border-collapse: collapse;
        }

        td {
            min-width: 100px;
        }

        tr {
            height: 30px;
        }

        tr:hover, td.hover {
            background: #eee;
        }
    </style>
</head>
<body>
<table>
    <tr>
        <td rowspan="2">1</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td rowspan="4">2</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td rowspan="2"></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td>3</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
</table>
</body>
</html>